import Vue from 'vue'
import Vuex from 'vuex'

// 全局注册
Vue.use(Vuex)

let state = {
    noteList: [], // 日志列表
    activeNote: {} // 被激活的日志对象 (当你写到渲染列表后，要处理激活样式、收藏那一个日志、删除哪个
        //日志、编辑哪个日志的时候，来定义的)
}

let mutations = {
    // 实现添加新日志对象的功能
    ADD_NOTE(state) {
        let noteObj = {
            text: '新日志',
            isFav: false // 是否被收藏
        }
        // 添加到数组中（改变状态）
        // state.noteList.push({
        //     text: '新日志',
        //     isFav: false // 是否被收藏
        // })
        state.noteList.push(noteObj)
        // 每次新添加日志对象的时候，要把最新的这个对象变成被激活的对象
        state.activeNote = noteObj
    },
    // 实现激活某个日志对象的功能
    ACTIVE_NOTE(state, item) {
        state.activeNote = item;
    },
    // 实现收藏某个日志对象的功能（谁被激活了就收藏或者取消收藏它）
    FAV_NOTE(state) {
        state.activeNote.isFav = !state.activeNote.isFav;
    },
    // 实现删除某个日志对象的功能（谁被激活了就删除谁）
    DEL_NOTE(state) {
        // 获取被删除对象（被激活对象）在日志数组中的位置
        let idx = state.noteList.indexOf(state.activeNote)
        state.noteList.splice(idx, 1);
        state.activeNote = state.noteList[0];
    }

}

let actions = {

}

let getters = {
    // 用法和计算属性很像，就是进行数据过滤格式化的
    // 获取收藏的日志列表
    favNoteList(state) {
        return state.noteList.filter(item => item.isFav);
    }
}

const store = new Vuex.Store({
    state,
    mutations,
    actions,
    getters
})

export default store


